<template>
    <div class="loginBox">
		
        <u--form
				labelPosition="right"
				:model="userInfo"
				ref="uForm"
				class="loginForm"
		>
			<h2  class="loginTitle">欢迎回来</h2>
			<div>
				<u-line length="44%" color="white" style="display: inline-block;"></u-line>
				<span style="font-size: 14px;color: #d0cec8;padding: 5px 5px;">登录</span>
				<u-line length="44%" color="white" style="display: inline-block;"></u-line>
			</div>
			
			<u-form-item
					label="用户名"
					prop="username"
					borderBottom
					ref="item1"
					labelWidth="80"
			>
				<u--input
						v-model="userInfo.username"
						placeholder="请输入你的用户名"
						border="none"
						placeholderStyle="color: #bdbdbd"
						color="#ffffff"
				></u--input>
			</u-form-item>
			<u-form-item
					label="密码"
					prop="password"
					borderBottom
					ref="item1"
					labelWidth="80"
			>
				<u--input
						v-model="userInfo.password"
						placeholder="请输入你的密码"
						border="none"
						placeholderStyle="color: #bdbdbd"
						color="white"
				></u--input>
			</u-form-item>
			<!-- <u--text>还没有账号去注册</u--text> -->
			<navigator url="/pages/register/register" class="neverUser">还没有账号去注册</navigator>
			<u-button type="info" @click='login'>登录</u-button>
		</u--form>
    </div>
</template>

<script>
    export default {
        data(){
            return{
                userInfo:{
                    username:'',
                    password:''

                },
            }
        },
        methods:{
            login(){
                this.$request({
                    url:'/prod-api/api/login',
                    method:'POST',
                    data:this.userInfo
                }).then(res=>{
                    console.log(res);
					if(res.data.code=='200'){
						uni.$u.toast('登录成功')
						uni.reLaunch({
							url:'/pages/myInfo/myInfo'
						})
					}else{
						uni.$u.toast(res.data.msg)
					}
                }).catch(err=>{
                    console.log(err);
                })
            },
            
        }
    }
</script>

<style lang="scss" scoped>
.loginBox{
	height: 93vh;
	background-image: url(@/static/img/780.jpg);
	background-size: cover;
	.loginForm{
		padding: 230rpx 30rpx 502rpx 30rpx;
		
		background-color: rgba(0, 0, 0, 0.5);
		/deep/span{
			color: white;
		}
		.loginTitle{
			text-align: center;
			color: white;
		}
		.neverUser{
			color: #767dfe;
			text-decoration: underline;
			padding:0 0 10px 0;
			font-size: 14px;
		}
	}
}

</style>